<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no"/>
    <title>我的资产</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css"/>
    <link rel="stylesheet" type="text/css" href="../css/style.css"/>
    <style>
        .yesterDay {
            font-size: 25px;
        }
        body{
            background: #fff;
        }
        .vertify-center > div {
            /*height: 50px;*/
        }
        header{
            background: #ff5429 ;
        }
        nav {
            /*position: -webkit-sticky;*/
            /*position: sticky;*/
            /*top: 0px;*/
            /*background: #fff;*/
            /*z-index: 9;*/
        }
        .sticky{
            position: fixed;
            top: 0;
            background: #fff;
            width: 100%;
            z-index: 9;
        }
        nav>div{
            position: relative;
        }
        nav>div.active:before{
            content:"";
            border-right:10px solid transparent;
            border-left:10px solid transparent;
            border-bottom:10px solid #ff5a00;
            position: absolute;
            left:50%;
            transform: translateX(-50%);
            bottom: 0;
        }
        .active{
            color: #fff !important;
        }
        .display-table-w1{
            vertical-align:middle;
        }
    </style>
</head>
<body style="height: 900px;   ">
<header class="">
    <div class="aui-text-center vertify-center" style="height: 200px;">
        <div class="aui-col-xs-12 font-size-12 " style="color: #fcab90;">昨日收入金豆</div>
        <div class="aui-col-xs-12 font-weight-700 yesterDay colorWhite" style="">5000</div>
        <div class="aui-col-xs-12 font-size-14 colorWhite">当前金豆&nbsp;&nbsp;80000</div>
    </div>
    <nav class="aui-text-center overhidden aui-padded-b-5" style="background: #ff5d32;">
        <div class="aui-col-xs-4 aui-padded-10-0">
            <p style="color:#fcab90;">金积分</p>
            <p class="colorWhite">5000000.08</p>
        </div>
        <div class="aui-col-xs-4 aui-padded-10-0">
            <p style="color:#fcab90;">银积分</p>
            <p class="colorWhite">50.00</p>
        </div>
        <div class="aui-col-xs-4 aui-padded-10-0">
            <p style="color:#fcab90;">铜积分</p>
            <p class="colorWhite">500.90</p>
        </div>
    </nav>
</header>
<div class="contain">
    <ul>
        <li class="display-table aui-padded-10 aui-border-b">
            <div class="display-table-w100">
                <p class="aui-ellipsis-2 font-weight-700 line-height-17">收益</p>
                <p class="color2 font-size-13">2017-8-21 21:21:53</p>
            </div>
            <div class="display-table-w1 font-weight-700">
                +500
            </div>
        </li>
        <li class="display-table aui-padded-10 aui-border-b">
            <div class="display-table-w100">
                <p class="aui-ellipsis-2 font-weight-700 line-height-17">收益</p>
                <p class="color2 font-size-13">2017-8-21 21:21:53</p>
            </div>
            <div class="display-table-w1 font-weight-700">
                +500
            </div>
        </li>
    </ul>
</div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/jquery-1.11.3.js"></script>
<script type="text/javascript">
    apiready = function () {
        api.parseTapmode();

        function onScroll(e) {
            window.scrollY >= 200 ? $("nav").addClass('sticky') :
                $("nav").removeClass('sticky');
        }
        document.addEventListener('scroll', onScroll);
    }
    function onScroll(e) {
        window.scrollY >= 200 ? $("nav").addClass('sticky') :
            $("nav").removeClass('sticky');
    }
    document.addEventListener('scroll', onScroll);
    $(function () {

    })
</script>
</html>
